<div class="standard-div rows" *ngIf="!isLoading; else loadingTem;">
  <h5 nz-typography i18n="@@common.general-settings">General settings</h5>
  <form nz-form [formGroup]="nameKeyForm" [nzLayout]="'vertical'" (ngSubmit)="updateWorkspace()">
    <nz-form-item>
      <nz-form-label i18n="@@common.name">Name</nz-form-label>
      <nz-form-control nzErrorTip="Workspace name is mandatory!" i18n-nzErrorTip="@@workspace.workspace.nameMandatory">
        <nz-input-group [nzPrefix]="orgIcon">
          <input id="name" type="text" nz-input formControlName="name" placeholder="Name" i18n-placeholder="@@common.name"/>
        </nz-input-group>
        <ng-template #orgIcon>
          <i nz-icon nzType="icons:icon-org"></i>
        </ng-template>
      </nz-form-control>
    </nz-form-item>
    <nz-form-item>
      <nz-form-label i18n="@@common.key">Key</nz-form-label>
      <nz-form-control nzHasFeedback i18n-nzValidatingTip="@@common.validating" nzValidatingTip="Validating..." [nzErrorTip]="keyErrorTpl">
        <nz-input-group [nzPrefix]="keyIcon">
          <input id="key" type="text" nz-input formControlName="key" placeholder="Key" i18n-placeholder="@@common.key"/>
        </nz-input-group>
        <ng-template #keyIcon>
          <i nz-icon nzType="key" nzTheme="outline"></i>
        </ng-template>
        <ng-template #keyErrorTpl let-control>
          <ng-container *ngIf="control.hasError('required')" i18n="@@common.key-cannot-be-empty">Key cannot be empty</ng-container>
          <ng-container *ngIf="control.hasError('duplicated')" i18n="@@common.key-has-been-used">This key has been used</ng-container>
          <ng-container *ngIf="control.hasError('unknown')" i18n="@@common.key-validation-failed">Key validation failed</ng-container>
        </ng-template>
      </nz-form-control>
    </nz-form-item>
    <button nz-button class="name-key-btn" nzType="primary" [nzLoading]="isNameKeyLoading" [disabled]="!canUpdateGeneralSettings">
      <i nz-icon nzType="icons:icon-sync"></i>
      <ng-container i18n="@@common.update">Update</ng-container>
    </button>
  </form>
</div>
<ng-container *ngIf="canUpdateLicense">
  <div class="standard-div rows" *ngIf="!isLoading; else loadingTem;">
    <h5 nz-typography i18n="@@common.license-settings">License settings</h5>
    <div class="row">
      <div class="row-title">
        <span i18n="@@common.id">Id</span>
        <i nz-icon i18n-nz-tooltip="@@common.workspace-id-copy-hint" nz-tooltip="You will need to provide this Id to generate the license, please contact us to get a license." nzType="icons:icon-info-outline"></i>
      </div>
      <div class="row-content">
        <nz-form-item class="extend">
          <nz-input-group class="row-input-group" [nzPrefix]="idIcon">
            <input disabled type="text" nz-input [ngModel]="workspace?.id" placeholder="License" i18n-placeholder="@@common.license"/>
            <ng-template #idIcon>
              <i nz-icon nzType="icons:icon-id"></i>
            </ng-template>
          </nz-input-group>
        </nz-form-item>
        <button nz-button class="copy-id-btn" nzType="primary" (click)="copyText(workspace?.id)">
          <i nz-icon nzType="icons:icon-copy"></i>
          <ng-container i18n="@@common.copy">Copy</ng-container>
        </button>
      </div>
    </div>
    <div class="row">
      <div class="row-title" i18n="@@common.license">License</div>
      <form class="row-content" nz-form [formGroup]="licenseForm" [nzLayout]="'inline'" (ngSubmit)="updateLicense()">
        <nz-form-item class="extend">
          <nz-form-control nzErrorTip="License is mandatory!" i18n-nzErrorTip="@@common.license-mandatory">
            <nz-input-group class="row-input-group" [nzPrefix]="licenseIcon">
              <input type="text" nz-input formControlName="license" placeholder="License" i18n-placeholder="@@common.license"/>
              <ng-template #licenseIcon>
                <i nz-icon nzType="icons:icon-license"></i>
              </ng-template>
            </nz-input-group>
          </nz-form-control>
        </nz-form-item>
        <button nz-button class="update-license-btn" nzType="primary" [nzLoading]="isLicenseLoading">
          <i nz-icon nzType="icons:icon-sync"></i>
          <ng-container i18n="@@common.updateLicense">Update</ng-container>
        </button>
      </form>
    </div>
  </div>
</ng-container>
<ng-container *ngIf="canUpdateSSOSettings && isSsoGranted">
  <div class="standard-div rows" *ngIf="!isLoading; else loadingTem;">
    <h5 nz-typography i18n="@@common.sso-settings">SSO (OIDC) settings</h5>
    <form nz-form [formGroup]="ssoForm" [nzLayout]="'vertical'" (ngSubmit)="updateOidcSetting()">
      <nz-form-item>
        <nz-form-label i18n="@@workspace.workspace.client-id">Client Id</nz-form-label>
        <nz-form-control nzErrorTip="Client Id is mandatory!" i18n-nzErrorTip="@@workspace.workspace.client-id-mandatory">
          <input class="standard-form-input" id="clientId" type="text" nz-input formControlName="clientId" placeholder="Client Id" i18n-placeholder="@@workspace.workspace.client-id"/>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label i18n="@@workspace.workspace.client-secret">Client secret</nz-form-label>
        <nz-form-control nzErrorTip="Client secret is mandatory!" i18n-nzErrorTip="@@workspace.workspace.client-secret-mandatory">
          <input class="standard-form-input" id="clientSecret" type="text" nz-input formControlName="clientSecret" placeholder="Client secret" i18n-placeholder="@@workspace.workspace.client-secret"/>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label i18n="@@workspace.workspace.token-endpoint">Token endpoint</nz-form-label>
        <nz-form-control nzErrorTip="Token endpoint is mandatory!" i18n-nzErrorTip="@@workspace.workspace.token-endpoint-mandatory">
          <input class="standard-form-input" id="tokenEndpoint" type="text" nz-input formControlName="tokenEndpoint" placeholder="Token endpoint" i18n-placeholder="@@workspace.workspace.token-endpoint"/>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label i18n="@@workspace.workspace.client-authentication-method">Client authentication method</nz-form-label>
        <nz-form-control nzErrorTip="Client authentication method is mandatory!" i18n-nzErrorTip="@@workspace.workspace.client-authentication-method-mandatory">
          <input class="standard-form-input" id="clientAuthenticationMethod" type="text" nz-input formControlName="clientAuthenticationMethod" placeholder="Client authentication method" i18n-placeholder="@@workspace.workspace.client-authentication-method"/>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label i18n="@@workspace.workspace.authorization-endpoint">Authorization endpoint</nz-form-label>
        <nz-form-control nzErrorTip="Authorization endpoint is mandatory!" i18n-nzErrorTip="@@workspace.workspace.authorization-endpoint-mandatory">
          <input class="standard-form-input" id="authorizationEndpoint" type="text" nz-input formControlName="authorizationEndpoint" placeholder="Authorization endpoint" i18n-placeholder="@@workspace.workspace.authorization-endpoint"/>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label i18n="@@workspace.workspace.scope">Scope</nz-form-label>
        <nz-form-control nzErrorTip="Scope is mandatory!" i18n-nzErrorTip="@@workspace.workspace.scope-mandatory">
          <input class="standard-form-input" id="scope" type="text" nz-input formControlName="scope" placeholder="Scope" i18n-placeholder="@@workspace.workspace.scope"/>
        </nz-form-control>
      </nz-form-item>
      <nz-form-item>
        <nz-form-label i18n="@@workspace.workspace.user-email-claim">User email claim</nz-form-label>
        <nz-form-control nzErrorTip="User email claim is mandatory!" i18n-nzErrorTip="@@workspace.workspace.user-email-claim-mandatory">
          <input class="standard-form-input" id="userEmailClaim" type="text" nz-input formControlName="userEmailClaim" placeholder="User email claim" i18n-placeholder="@@workspace.workspace.user-email-claim"/>
        </nz-form-control>
      </nz-form-item>
      <button nz-button class="name-key-btn" nzType="primary" [nzLoading]="isSsoLoading">
        <i nz-icon nzType="icons:icon-sync"></i>
        <ng-container i18n="@@common.update">Update</ng-container>
      </button>
    </form>
  </div>
</ng-container>
<ng-template #loadingTem>
  <div class="block" style="margin: auto;text-align: center">
    <nz-skeleton [nzActive]="true" [nzParagraph]="{ rows: 4 }"></nz-skeleton>
  </div>
</ng-template>
